import React from "react";
import { useNavigate, Outlet } from "react-router-dom";
import { Tabbar } from "react-vant";
import { DiamondO, HomeO, ShieldO, UserO } from "@react-vant/icons";
import RouterList from "../../router";
const Index: React.FC = () => {
  const navigate = useNavigate();
  const navChange = (item: any) => {
    navigate(item.path);
  };
  return (
    <div>
      <Outlet />
      <Tabbar placeholder>
        {RouterList[3].children?.map((item, index) => (
          <Tabbar.Item icon={item.meate?.icon} onClick={() => navChange(item)}>
            {item.meate?.title}
          </Tabbar.Item>
        ))}
      </Tabbar>
    </div>
  );
};
export default Index;
